<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>添加用户</title>
<link rel="stylesheet" type="text/css" href="datepicker/css/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="css/public.css" />
<style type="text/css">

/*对DateTimePicker 样式的修改*/
#ui-datepicker-div{
	 font:12px/18px Tahoma, Helvetica, Arial, Verdana, "\5b8b\4f53", sans-serif;
	 color:#51555C;
	 display:none;
	}
</style>
<style type="text/css">
#cam{float:left; width:320px; height:300px; margin:10px;}
.btn{height:28px; line-height:28px; border:1px solid #d3d3d3; margin-top:10px; background:url(btn_bg.gif) repeat-x; cursor:pointer}
#results{margin-top:0px;}
</style>

<script type="text/javascript" src="js/jquery-1.8.1.min.js"></script>
<script type="text/javascript" src="datepicker/js/jquery-ui-datepicker.js"></script>
<script type="text/javascript" src="jpegcam/webcam.js"></script> 
<script type="text/javascript">
$(function(){
	$("#date").datepicker({
		maxDate: 0
	});
	$(".tab td").addClass("tab_bor");
});
</script>
</head>

<body>
<div style="height:30px; font-size:15px; margin:10px 0px 0px 10px;">
   <img src="images/addUser.gif" height="30px"/><span style="font-size:18px; margin-left:4px; color:#06C;"><strong>添加用户</strong></span>
</div>
<hr  width="98%" style="margin-left:10px; color:#06F;" align="left" color="#0066FF"/>
<form>
<table border="0" cellspacing="0" cellpadding="0" class="tab">
  <tr>
    <td colspan="6" class="tab_top" align="center">基本信息</td>
  </tr>
  <tr>
    <td align="right" width="100px" class="tab_bor">姓名：</td>
    <td align="left" width="300px;">&nbsp;<input type="text" name="name" size="20" maxlength="20" autofocus="autofocus"   title="2-20个字符的英文或者中文"/>&nbsp;<span style="color:#F00">*</span></td>
    <td align="right" width="100px">身份证号码：</td>
    <td width="300px">&nbsp;<input type="text" name="idcard" size="20" maxlength="18" title="18位有效身份证号码"/>&nbsp;<span style="color:#F00">*</span></td>
    <td align="right" width="100px">联系方式：</td>
    <td width="300px">&nbsp;<input type="text" name="tel" size="15"  maxlength="11"/></td>
  </tr>
  <tr>
    <td align="right">性别：</td>
    <td>&nbsp;<input type="radio"  name="sex" checked="checked"/> 男<input type="radio"  name="sex"/> 女</td>
    <td align="right">出生年月：</td>
    <td>&nbsp;<input type="text" id="date" name="birth" readonly="readonly" value="1990-01-02"/></td>
    <td align="right">年龄：</td>
    <td>&nbsp;<input type="text"  name="age"  size="15"/></td>
  </tr>
  <tr>
    <td align="right">文化程度：</td>
    <td>&nbsp;<select size="1" name="degree">
        <option selected="selected" value="1">高中</option>
        <option value="2">初中</option>
        <option value="3">小学</option>
        <option value="4">本科</option>
        <option value="5">研究生</option>
      </select>
    </td>
    <td align="right">民族：</td>
    <td>&nbsp;<select size="1" name="national">
        <option selected="selected" value="1">汉族</option>
        <option value="2">其他</option>
      </select>
    </td>
    <td align="right">工种：</td>
    <td>&nbsp;<select size="1" name="">
        <option value="1"  selected="selected">食品行业</option>
        <option value="2" >美容行业</option>
      </select>
    </td>
  </tr>
  <tr>
    <td align="right">职业：</td>
    <td>&nbsp;<input type="text"  name="word"  /></td>
    <td align="right">添加人：</td>
    <td>&nbsp;<input type="text" value="admin" readonly="readonly" name="" /></td>
    <td align="right">添加时间：</td>
    <td>&nbsp;<input type="text" value="2012-10-01 11：23:32" readonly="readonly" name="" /></td>
  </tr>
  </table>
  <br />
  <table border="0" cellspacing="0" cellpadding="0" class="tab">
  <tr>
    <td colspan="6" class="tab_top" align="center">患病史</td>
  </tr>
  <tr>
    <td align="right">肝炎：</td>
    <td>&nbsp;<input type="radio" name="hepatitis" value="1"  checked="checked"/>无<input type="radio" name="hepatitis" value="2" />有&nbsp;<input type="text" maxlength="50" size="16" name="hepatitis_val"  disabled="disabled"/></td>
    <td align="right">痢疾：</td>
    <td>&nbsp;<input type="radio" name="dysentery" value="1"  checked="checked"/>无<input type="radio" name="dysentery" value="2" />有&nbsp;<input type="text" maxlength="50" size="16" name="dysentery_val"  disabled="disabled"/></td>
    <td align="right">伤寒：</td>
    <td>&nbsp;<input type="radio" name="typhoid" value="1"  checked="checked"/>无<input type="radio" name="typhoid" value="2" />有&nbsp;<input type="text" maxlength="50" size="16" name="typhoid_val"  disabled="disabled"/></td>
  </tr>
  <tr>
    <td align="right">肺结核：</td>
    <td>&nbsp;<input type="radio" name="tuberculosis" value="1"  checked="checked"/>无<input type="radio" name="tuberculosis" value="2" />有&nbsp;<input type="text" maxlength="50" size="16" name="tuberculosis_val"  disabled="disabled"/></td>
    <td align="right">皮肤病：</td>
    <td>&nbsp;<input type="radio" name="skin" value="1"  checked="checked"/>无<input type="radio" name="skin" value="2" />有&nbsp;<input type="text" maxlength="50" size="16" name="skin_val"  disabled="disabled"/></td>
    <td align="right">其他：</td>
    <td>&nbsp;<input type="radio" name="other" value="1"  checked="checked"/>无<input type="radio" name="other	" value="2" />有&nbsp;<input type="text" maxlength="50" size="16" name="other_val"  disabled="disabled"/></td>
  </tr>
   </table>
   <br />
  <table border="0" cellspacing="0" cellpadding="0"class="tab">
  <tr>
    <td colspan="6"class="tab_top" align="center">拍照</td>
  </tr>
  <tr>
    <td colspan="6" align="left" valign="top">
        <div id="cam" style="border:1px solid #999"> 
          <script language="JavaScript">
		    webcam.set_api_url( 'action.php' );
		    webcam.set_quality( 90 ); // JPEG quality (1 - 100)
		    webcam.set_shutter_sound( true ); // play shutter click sound
		    document.write( webcam.get_html(320, 240, 160,120) );
	      </script>
          <input type=button value="点击这里拍照" class="btn" onclick="take_snapshot()"> 
          
          <script language="JavaScript">
			webcam.set_hook( 'onComplete', 'my_completion_handler' );
			
			function take_snapshot() {
				// take snapshot and upload to server
				document.getElementById('results').innerHTML = '<h4>Uploading...</h4>';
				webcam.snap();
			}
			function my_completion_handler(msg) {
				// extract URL out of PHP output
				if (msg.match(/(http\:\/\/\S+)/)) {
					var image_url = RegExp.$1;
					// show JPEG image in page
					document.getElementById('results').innerHTML = 
						'<h4>Upload Successful!</h4>' + 
						'<img src="' + image_url + '">';
					// reset camera for another shot
					webcam.reset();
				}
				else alert("PHP Error: " + msg);
			}
		</script>
        </div> 
        <div id="results"> 
         <!--显示上传结果--> 
        </div>
        <div style="height:0px; clear:both;  line-height:0px;"></div>
    </td>
  </tr>
  <tr>
    <td colspan="6" height="36px" align="center" valign="middle">
      <input type="submit" value="保  存" class="btn_style"/>
      <input type="button" value="保存体检" class="btn_style" />
      <input type="reset" value="重  置"  class="btn_style"/>
    </td>
  </tr>
</table>

</form>

</body>
</html>
